/*resizes header and foooter on small screens*/
@media screen and (max-width: 550px)
{
	#header {
		padding-left: 0px;
		padding-right: 0px;		
	}
}

/*Takes out padding on small screens*/
@media screen and (max-width: 550px)
{
	.gradient{
		padding-left: 5px;
		padding-right: 5px;
		box-shadow: 0 4px 3px 0 rgba(0,0,0,0.4);
	}
}

/*resizes spec and page contents on different screens*/
@media (max-width: 855px) and (min-width: 710px){
	#spec{
		width: 45%;
		float: right;
	}
}
@media (max-width: 855px) and (min-width: 710px){
	#page-contents{
		width: 45%;
	}
}
@media (max-width: 550px){
	#spec{
		display: block;
		float: left;
    /*margin-top: 20px;*/
   		margin-right: 0px;
    	width: 	98%;
   		margin-bottom: 10px;
    	padding: 5px;
		border: 1px solid black;
		box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
		background: rgb(255,255,255); /* Old browsers */
		background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
	}
}
@media (max-width: 550px){
	#page-contents{
		border:1px solid black;
		display: block;
		float: left;
		width: 98%;
		padding: 5px;
	/*margin-top: 20px;*/
   		margin-right: 0px;
		margin-bottom: 10px;
    	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	}
}

@media(max-width: 400px){
	.button{
		width: 100%
	}
}

@media (max-width: 550px){
	article{
		margin-right: 5px;
		margin-left: 1px;
	}
}

@media (max-width: 345px){
	.logo{
		max-width: 70px;
	}
}

@media (max-width: 550px){
	.search{
		max-width: 100%;
	}
}

/*resizes menu text on small screens*/
@media screen and (max-width: 550px)
{
	.menu > ul > li 
		{font-size: 14px;}
}

@media (max-width: 500px){
 	h1{
 		font-size: 200%;
 	}
 }

@media screen and (max-width: 700px)
{
	.floating-box{
		margin-top: 10px;
		margin-bottom: 5px;		
	}
}

@media screen and (max-width: 700px)
{
	.tray{
		display: block;
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

@media only screen and (max-width: 620px) {
.video-container{
	position: relative;
	padding-bottom: 56.25%;
}
	 /* 16:9 */
	padding-top: 25px;
	height: 0;
}
@media (max-width: 550px){
	.nav_link{display: none;
	}
}

@media screen and (max-width: 615px)
{
	img.topicHomeimg{
		max-width: 100%;
		margin-left: : 0px;
		margin-right: 15px;
		margin-top: 15px;		
	}
}

@media (max-width: 615px)
{
	.Topictext{
		max-width: 100%;
	}
}

@media (max-width: 615px)
{
	.video-tray{
		max-width: 100%;
	}
}

@media screen and (max-width: 615px)
{
	.hide-text{
		display: none;
	}

}